<div class="hold-transition">
  <div id="app">
    <div class="content-header">
      <h1>预约管理<small>检查项管理</small></h1>
      <el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
        <el-breadcrumb-item to="/">首页</el-breadcrumb-item>
        <el-breadcrumb-item>预约管理</el-breadcrumb-item>
        <el-breadcrumb-item>检查项管理</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="app-container">
      <div class="box">
        <div class="filter-container">
          <el-input placeholder="项目编码/项目名称" #queryParams style="width: 200px;" class="filter-item"></el-input>
          <el-button (click)="findPage(queryParams.model)"  class="dalfBut">查询</el-button>
          <el-button type="primary" class="butT" (click)="handleCreate()">新建</el-button>
        </div>
        <el-table size="small" current-row-key="id" [model]="dataList"  [stripe]="true">
          <el-table-column type="index" align="center" label="序号"></el-table-column>
          <el-table-column prop="code" label="项目编码" align="center"></el-table-column>
          <el-table-column prop="name" label="项目名称" align="center"></el-table-column>
          <el-table-column label="适用性别" align="center">
<!--            <template slot-scope="scope">-->
              <span>"待补充"</span>
<!--            </template>-->
          </el-table-column>
          <el-table-column prop="age" label="适用年龄" align="center"></el-table-column>
          <el-table-column prop="remark" label="项目说明" align="center"></el-table-column>
          <el-table-column label="操作" align="center">
<!--            <template slot-scope="scope">-->
              <el-button type="primary" size="mini" (click)="handleUpdate()">编辑</el-button>
              <el-button size="mini" type="danger" (click)="handleDelete()">删除</el-button>
<!--            </template>-->
          </el-table-column>
        </el-table>
        <!--        <div class="pagination-container">
                  <el-pagination
                    class="pagiantion"
                    @current-change="handleCurrentChange"
                    :current-page="pagination.currentPage"
                    :page-size="pagination.pageSize"
                    layout="total, prev, pager, next, jumper"
                    :total="pagination.total">
                  </el-pagination>
                </div>
                 新增标签弹层
                <div class="add-form">
                  <el-dialog title="新增检查项" :visible.sync="dialogFormVisible">
                    <el-form ref="dataAddForm" :model="formData" :rules="rules" label-position="right" label-width="100px">
                      <el-row>
                        <el-col :span="12">
                          <el-form-item label="项目编码" prop="code">
                            <el-input v-model="formData.code"/>
                          </el-form-item>
                        </el-col>
                        <el-col :span="12">
                          <el-form-item label="项目名称" prop="name">
                            <el-input v-model="formData.name"/>
                          </el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="12">
                          <el-form-item label="性别">
                            <el-select v-model="formData.sex">
                              <el-option label="不限" value="0"></el-option>
                              <el-option label="男" value="1"></el-option>
                              <el-option label="女" value="2"></el-option>
                            </el-select>
                          </el-form-item>
                        </el-col>
                        <el-col :span="12">
                          <el-form-item label="适用年龄">
                            <el-input v-model="formData.age"/>
                          </el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="12">
                          <el-form-item label="类型">
                            <el-select v-model="formData.type">
                              <el-option label="检查" value="1"></el-option>
                              <el-option label="检验" value="2"></el-option>
                            </el-select>
                          </el-form-item>
                        </el-col>
                        <el-col :span="12">
                          <el-form-item label="价格">
                            <el-input v-model="formData.price"/>
                          </el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="24">
                          <el-form-item label="项目说明">
                            <el-input v-model="formData.remark" type="textarea"></el-input>
                          </el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="24">
                          <el-form-item label="注意事项">
                            <el-input v-model="formData.attention" type="textarea"></el-input>
                          </el-form-item>
                        </el-col>
                      </el-row>
                    </el-form>
                    <div slot="footer" class="dialog-footer">
                      <el-button @click="dialogFormVisible = false">取消</el-button>
                      <el-button type="primary" @click="handleAdd()">确定</el-button>
                    </div>
                  </el-dialog>
                </div>

                 编辑标签弹层
                <div class="add-form">
                  <el-dialog title="编辑检查项" :visible.sync="dialogFormVisible4Edit">
                    <el-form ref="dataEditForm" :model="formData" :rules="rules" label-position="right" label-width="100px">
                      <el-row>
                        <el-col :span="12">
                          <el-form-item label="项目编码" prop="code">
                            <el-input v-model="formData.code"/>
                          </el-form-item>
                        </el-col>
                        <el-col :span="12">
                          <el-form-item label="项目名称" prop="name">
                            <el-input v-model="formData.name"/>
                          </el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="12">
                          <el-form-item label="性别">
                            <el-select v-model="formData.sex">
                              <el-option label="不限" value="0"></el-option>
                              <el-option label="男" value="1"></el-option>
                              <el-option label="女" value="2"></el-option>
                            </el-select>
                          </el-form-item>
                        </el-col>
                        <el-col :span="12">
                          <el-form-item label="适用年龄">
                            <el-input v-model="formData.age"/>
                          </el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="12">
                          <el-form-item label="类型">
                            <el-select v-model="formData.type">
                              <el-option label="检查" value="1"></el-option>
                              <el-option label="检验" value="2"></el-option>
                            </el-select>
                          </el-form-item>
                        </el-col>
                        <el-col :span="12">
                          <el-form-item label="价格">
                            <el-input v-model="formData.price"/>
                          </el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="24">
                          <el-form-item label="项目说明">
                            <el-input v-model="formData.remark" type="textarea"></el-input>
                          </el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="24">
                          <el-form-item label="注意事项">
                            <el-input v-model="formData.attention" type="textarea"></el-input>
                          </el-form-item>
                        </el-col>
                      </el-row>
                    </el-form>
                    <div slot="footer" class="dialog-footer">
                      <el-button @click="dialogFormVisible4Edit = false">取消</el-button>
                      <el-button type="primary" @click="handleEdit()">确定</el-button>
                    </div>
                  </el-dialog>
                </div> -->
      </div>
    </div>
  </div>
</div>
